import React, { useEffect } from 'react';
import { PlusOutlined } from '@ant-design/icons';
import { Button, message, Input, Drawer, Row, Col } from 'antd';
import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
import FilterSearch from '@/components/FilterSearch';
import TableList from '@/components/TableList';
import { timeFormat } from '@/utils/common';

const ErrorList = () => {
  const getColumn = (title) => {
    return [
      {
        title: title,
        dataIndex: '_id',
      },
      {
        title: '总数',
        dataIndex: 'num',
      },
    ];
  };

  return (
    <PageContainer>
      <Row>
        <Col span={12}>
          <TableList
            post
            rowKey="id"
            columns={getColumn('页面路径')}
            source="/api/monitor/admin/statistics"
            params={{
              type: 'page',
              key: 'url_path',
            }}
          />
        </Col>
        <Col span={12}>
          <TableList
            post
            rowKey="id"
            columns={getColumn('操作系统')}
            source="/api/monitor/admin/statistics"
            params={{
              type: 'device',
              key: 'system',
            }}
          />
        </Col>
        <Col span={12}>
          <TableList
            post
            rowKey="id"
            columns={getColumn('ip地址')}
            source="/api/monitor/admin/statistics"
            params={{
              type: 'device',
              key: 'ip',
            }}
          />
        </Col>
        <Col span={12}>
          <TableList
            post
            rowKey="id"
            columns={getColumn('系统版本')}
            source="/api/monitor/admin/statistics"
            params={{
              type: 'device',
              key: 'system_version',
            }}
          />
        </Col>
      </Row>
    </PageContainer>
  );
};

export default ErrorList;
